<template>
  <div>
    <div class="py-1 px-1 bg-white d-scroll listInner facilityDetail">
      <custom-title :is-line="true" title="基本信息" />

      <div class="baseLoad">
        <div v-for="(item, index) in descList" :key="index">
          <template v-if="item.type === 'all' || activeTag === item.type">
            <custom-details-item :label="item.label" :icon="item.icon">
              <template #valueSlot>
                <span v-if="!item.isFile">{{ item.value }}</span>
                <span v-if="descData.planUseYearState && item.fieldName === 'planUseYear'" class="ml-1 van-tag van-tag--plain van-tag--danger">{{ descData.planUseYearState }}</span>
                <el-link v-if="item.isFile" type="primary" @click="openAttachPopUp(item.value,item.fieldName === 'shareAttachVos'?'attachPopUp' : 'useRecordLists')">查看</el-link>
              <!--              <el-link v-else type="primary" @click="handleDownLoad(item.uuid)">{{ item.value === '' || item.value.length === 0?'&#45;&#45;' : item.value }}</el-link>-->
              </template>
            </custom-details-item>
          </template>
        </div>
      </div>

      <div>
        <custom-title :is-line="true" title="设备检验信息" />
        <div class="common_list" style="padding: 0">
          <template v-if="listData && listData.length>0">
            <div v-for="(item, index) in listData" :key="index" class="list_item">
              <div class="content_area">
                <div class="number_order">{{ index + 1 }}</div>
                <div class="right_content">
                  <div class="content_title" style="max-width: 100%">{{ item.name }}</div>
                  <ul>
                    <li v-for="(it,ind) in fieldList" :key="index + '' + ind">
                      <i :class="'iconfont c-text-color' + ((ind % 7) + 1)" v-html="it.icon" />
                      <div class="label">{{ it.label }}：</div>
                      <div class="value">
                        <span v-if="!it.isFile">
                          {{ item[it.field]?item[it.field]:'/' }}
                          <span v-if="it.field === 'nextTime'" :class="item['nextTimeState'] === '超期'?'redFont':item['nextTimeState'] === '临期'?'orangeFont':''" class="ml-1 van-tag">{{ item.nextTimeState !== '正常' ? item.nextTimeState : '' }}</span>
                        </span>
                        <template v-else>
                          <el-link v-if="active === '特种设备'" type="primary" @click="openAttachPopUp(item[it.field],'attachPopUp')">查看</el-link>
                          <el-link v-else type="primary" @click="openAttachPopUp([item],'examineLists')">查看</el-link>
                        </template>

                        <!--                        <el-link v-else type="primary" @click="handleDownLoad(item.examineAttachUUID)">{{ item[it.field] }}</el-link>-->
                      </div>
                    </li>
                  </ul>
                </div>
              </div>
            </div>
          </template>
          <el-empty v-else class="baseLoad1" />
        </div>
      </div>
    </div>
    <attachPopUp ref="useRecordLists" file-name-key="useRecordName" file-url-key="useRecordUUID" />
    <attachPopUp ref="attachPopUp" file-name-key="fileName" file-url-key="fileUrl" />
    <attachPopUp ref="examineLists" file-name-key="examineAttachName" file-url-key="examineAttachUUID" />
  </div>
</template>

<script>
import { otherDeviceDetail, specialDeviceDetail } from '@/api/commonPage/facility'
import commonList from '@/assets/mixin/commonList'

export default {
  mixins: [commonList],
  props: {
    activeTag: {
      required: true,
      type: String
    }
  },
  data() {
    return {
      companyName: '',
      active: '',
      current: '',
      examineId: '',
      descList: [
        { icon: '&#xe790;', label: '企业名称', value: '/', fieldName: 'companyName', type: 'all' },
        { icon: '&#xe62c;', label: '设备名称', value: '/', fieldName: 'deviceName', type: 'all' },
        { icon: '&#xe791;', label: '设备种类', value: '/', fieldName: 'deviceSpecies', type: '特种设备' },
        { icon: '&#xe6aa;', label: '设备类别', value: '/', fieldName: 'deviceType', type: '特种设备' },
        { icon: '&#xe634;', label: '设备品种', value: '/', fieldName: 'deviceBreed', type: '特种设备' },
        { icon: '&#xe64e;', label: '规格型号', value: '/', fieldName: 'modelNum', type: 'all' },
        { icon: '&#xe8d5;', label: '设计使用年限', value: '/', fieldName: 'planUseYear', type: 'all' },
        { icon: '&#xe87e;', label: '设备使用地点', value: '/', fieldName: 'deviceAddr', type: 'all' },
        { icon: '&#xe617;', label: '投入使用日期', value: '/', fieldName: 'putUseTime', type: 'all' },
        { icon: '&#xe677;', label: '使用登记证', value: '/', fieldName: 'useRecordName', isFile: true, type: '特种设备' },
        { icon: '&#xe700;', label: '安全管理员', value: '/', fieldName: 'securityHead', type: 'all' },
        { icon: '&#xe700;', label: '是否进行安全评审', value: '/', fieldName: 'isSafeExam', type: 'all' },
        { icon: '&#xe700;', label: '安全评审资料', value: '/', fieldName: 'safeExamList', type: 'all', isFile: true }
      ],
      listData: [],
      fieldList: [
        { icon: '&#xe617;', field: 'examineTime', label: '检验日期' },
        { icon: '&#xe791;', field: 'examineType', label: '检验类别' },
        { icon: '&#xe62c;', field: 'examineOrgan', label: '检验机构名称' },
        { icon: '&#xe668;', field: 'conclusion', label: '检验结论' },
        { icon: '&#xe677;', field: 'shareAttachVos', label: '检验报告/监检证书', isFile: true, type: '特种设备' },
        { icon: '&#xe617;', field: 'nextTime', label: '下次检验日期' }
      ],
      descData: {}
    }
  },
  created() {
    const { current, examineId, active } = this.$route.query
    this.examineId = examineId || ''
    this.current = current || ''
    this.active = active || ''
  },
  async mounted() {
    this.layout.showAreaLoading(['.baseLoad', '.baseLoad1'])
    const { status, data } = await (this.active === '特种设备' ? specialDeviceDetail : otherDeviceDetail)({ examineId: this.examineId })
    if (status === 0 && data) {
      this.descList.forEach(val => {
        val.value = data[val.fieldName] ? data[val.fieldName] : val.value
        if (val.fieldName === 'useRecordName') {
          if (data.useRecordName && data.useRecordUUID) {
            val.value = [{
              useRecordName: data.useRecordName,
              useRecordUUID: data.useRecordUUID
            }]
          } else {
            val.value = []
          }
        }
      })
      if (data.isSafeExam !== '是') {
        this.descList.pop()
      }
      this.descData = data
      this.listData = data.examineList
    }
    this.layout.hideAreaLoading(['.baseLoad', '.baseLoad1'])
  },
  methods: {
    // 获取企业详情数据--基本信息
  }
}
</script>

<style lang="scss" scoped>
::v-deep .common_list .list_item .content_area .right_content ul li .value {
  overflow: unset;
}
.olMap {
  width: 100%;
  height: 350px;
}
.facilityDetail{
  .redFont{color:red;border: 1px solid red}
  .orangeFont{color:orange;border: 1px solid orange}
  ::v-deep .common_list .list_item .content_area .right_content ul li{
    align-items: center;
  }
}
</style>
